<template>
  <dys-modal
    :open="open"
    :title="t('数据表管理')"
    :confirm-loading="loading"
    @cancel="emit('cancel')"
    @ok="handleSubmit"
    :width="1200"
  >
    <template #otherBtn v-if="!!model?.tableId">
      <a-button type="primary" @click="handlePublish">
        <UploadOutlined />{{ t("发布") }}
      </a-button>
    </template>
    <a-row>
      <a-col :span="6">
        <table-info-card
          :model="model"
          :open="open"
          ref="infoRef"
        ></table-info-card>
      </a-col>
      <a-col :span="18">
        <table-field-card :model="model" ref="fieldRef"></table-field-card>
      </a-col>
    </a-row>
  </dys-modal>
</template>
<script lang="ts" setup>
import { ref } from "vue";
import { useI18n } from "vue-i18n";
import { message } from "ant-design-vue";
import { add, publish, update } from "@/api/low-code/table";
import type { QueryResult } from "@/api/low-code/table/typing";
import TableInfoCard from "./table-info-card.vue";
import TableFieldCard from "./table-field-card.vue";
import { cloneDeep } from "lodash";
interface Props {
  /**弹窗 */
  open: boolean;
  /**行数据 */
  model: QueryResult;
}
const props = defineProps<Props>();
const emit = defineEmits(["cancel", "ok"]);
const { t } = useI18n();
const loading = ref(false);
const infoRef = ref<InstanceType<typeof TableInfoCard>>();
const fieldRef = ref<InstanceType<typeof TableFieldCard>>();
/**校验数据表字段 */
const validFields = () => {
  const list = fieldRef.value?.state.list || [];
  const LEN = list.length;
  if (LEN <= 6) return t("请添加数据表字段");
  for (let i = 0; i < LEN; i++) {
    const item = list[i];
    if (!item.fieldCode) {
      return t("请输入第") + (i + 1) + t("行字段名");
    } else if (!item.fieldType) {
      return t("请选择第") + (i + 1) + t("行字段类型");
    } else if (!item.fieldDesc) {
      return t("请输入第") + (i + 1) + t("行字段描述");
    }
    if (item.fieldType == "varchar" && !item.fieldLength) {
      return t("请输入第") + (i + 1) + t("行字段长度");
    }
  }
  return false;
};
/**提交 */
const handleSubmit = async () => {
  try {
    await infoRef.value.validate();
  } catch {
    return message.warning(t("校验失败"));
  }
  // 数据表字段校验
  const valid = validFields();
  if (valid) {
    return message.warning(valid);
  }
  loading.value = true;
  const list = cloneDeep(fieldRef.value.state.list);
  const { success } = await (props.model?.tableId ? update : add)({
    info: infoRef.value.modelRef,
    fieldList: list.map((m) => {
      // 删除辅助字段
      delete m.disabled;
      return m;
    }),
  });
  loading.value = false;
  if (success) {
    message.success(props.model?.tableId ? t("修改成功") : t("新增成功"));
    emit("ok");
    emit("cancel");
  }
};
/**发布数据表 */
const handlePublish = async () => {
  loading.value = true;
  const { success } = await publish({ tableId: props.model.tableId });
  loading.value = false;
  if (success) {
    message.success(t("发布成功"));
    emit("ok");
    emit("cancel");
  }
};
</script>
